<template>
	<view>
		<ly-tree :tree-data="treeData" :ready="ready" :props="props" node-key="_id" highlightCurrent showNodeIcon
		 defaultExpandAll :expandOnClickNode="false" :showCheckbox="showCheckbox" :showRadio="showRadio" @check="checkItems"></ly-tree>
	</view>
</template>

<script>
	const db = uniCloud.database();
	export default {
		data() {
			return {
				permission: [],
				treeData: [],
				ready: false, // 这里用于自主控制LyTree 的 loading加载状态，避免异步正在加载数据的空档显示“暂无数据”
				props: function() {
					return {
						label: 'permission_name', // 指把数据中的‘personName’当做label也就是节点名称
						icon(data, node) {
							if (node.data.parent_id == "") {
								return ""
							}
						}
					}
				},
			};
		},
		props: {
			value: [Number, String, Array],
			isEdit: {
				type: Boolean,
				default: false
			},
			// 节点多
			showCheckbox: {
				type: Boolean,
				default: true
			},
			// 节点单选
			showRadio: {
				type: Boolean,
				default: false
			},
			field: {
				type: String,
				default: "permission_id"
			}
		},
		watch: {
			value(newVal) {
				if (this.showRadio) {
					this.permission = [newVal]
				} else {
					this.permission = newVal
				}
				if (this.formItem) {
					this.formItem.setValue(newVal)
				}
				console.log("watch value", newVal)
				if (!this.ready) {
					this.loadPermissions()
				}
			}
		},
		created() {
			if (this.showRadio) {
				this.permission = [this.value]
			} else {
				this.permission = this.value
			}
			this.form = this.getForm('uniForms')
			this.formItem = this.getForm('uniFormsItem')
			if (this.formItem) {
				if (this.formItem.name) {
					this.rename = this.formItem.name
					this.form.inputChildrens.push(this)
				}
			}
			if (!this.isEdit) {
				this.loadPermissions()
			}
		},
		methods: {
			/**
			 * 初始化变量值
			 */
			init() {

			},
			/**
			 * 获取父元素实例
			 */
			getForm(name = 'uniForms') {
				let parent = this.$parent;
				let parentName = parent.$options.name;
				while (parentName !== name) {
					parent = parent.$parent;
					if (!parent) return false;
					parentName = parent.$options.name;
				}
				return parent;
			},
			loadPermissions() {
				db.collection('uni-id-permissions')
					.field("permission_id,permission_name,parent_id")
					.orderBy("parent_id asc")
					.get({
						getTree: true
					})
					.then((res) => {
						this.treeData = res.result.data;
						this.preCheckItems(this.treeData);
						console.log("treeData", this.treeData);
					}).catch((err) => {
						uni.showModal({
							content: err.message || '请求服务失败',
							showCancel: false
						})
					}).finally(() => {
						this.ready = true // 关闭tree控件的等待loading
					})
			},
			preCheckItems(items) {
				let checked = false;
				if (items && items.length > 0) {
					checked = true;
					items.forEach(e => {
						if (this.showCheckbox) {
							if (e.children && e.children.length > 0) {
								e.checked = this.preCheckItems(e.children);
							} else {
								e.checked = this.permission.indexOf(e[this.field]) != -1;
							}
							//只要有一个没选择，则上级不选择
							if (!e.checked) {
								checked = false;
							}
						} else if (this.showRadio) {
							if (e.children && e.children.length > 0) {
								this.preCheckItems(e.children);
							}
							e.checked = this.permission.indexOf(e[this.field]) != -1;
						}
					})
				}
				return checked;
			},
			checkItems(e) {
				//全选中和半选中
				this.permission = e.halfCheckedNodes.concat(e.checkedNodes).map(per => per[this.field]).sort();
				//console.log("checkItems", e)
				console.log("checkItems", this.permission)
				let newVal = this.permission;
				if (this.showRadio) {
					newVal = this.permission && this.permission.length > 0 ? this.permission[0] : "";
				}
				this.$emit('input', newVal);
			}
		}
	}
</script>

<style lang="scss">

</style>
